React: Suspense
Reactにおいて、子要素の読み込みが完了するまでフォールバック要素を代わりにレンダリングする仕組み React 18で正式版になった
使い方
データフェッチ等が発生しうるコンポーネントをサスペンスバウンダリ <Suspense> で囲う
code:jsx
<Suspense fallback={<Loading />}>
<Stuff />
</Suspense>
サスペンスに対応したデータフェッチはReact 19現在以下の通り:
use hookを用いたPromiseからの値の読み取り 🔗 また、非公式の方法としてPromiseをthrowする方法があるが、React 19以降は use を使ったほうが良いと思われる